function addToolBarList(parames){
	if(parames == undefined){
		parames = {};
	}

	var divArr = [];
	var tmpStr = '';
	for(var i = 0; i < 11; i++){
		var tmp = 'b' + i;
		var tmp = $("<div>").addClass("btn-group");
		divArr.push(tmp);
	}
	
	//font-family
	var a1 = $("<a>").addClass("btn dropdown-toggle").attr({"data-toggle": "dropdown", "title": "字体"});
	var i1 = $("<i>").addClass("icon-font");
	var b1 = $("<b>").addClass("caret");
	var u1 = $("<ul>").addClass("dropdown-menu");
	a1.append(i1).append(b1);
	divArr[0].append(a1).append(u1);
	
	//font-size
	var a2 = $("<a>").addClass("btn dropdown-toggle").attr({"data-toggle": "dropdown", "title": "字号"});
	var i2 = $("<i>").addClass("icon-text-height");
	var b2 = $("<b>").addClass("caret");
	var u2 = $("<ul>").addClass("dropdown-menu");
	a2.append(i2).append(b2);
	divArr[1].append(a2).append(u2);
	tmpStr = '<li><a data-edit="fontSize 5"><font size="5">Huge</font></a></li>'+
        '<li><a data-edit="fontSize 3"><font size="3">Normal</font></a></li>' +
        '<li><a data-edit="fontSize 1"><font size="1">Small</font></a></li>';
	u2.html(tmpStr);
	
	//font-bold italic line-through under-line
	tmpStr = '<a class="btn" data-edit="bold" title="加粗 (Ctrl/Cmd+B)"><i class="icon-bold"></i></a>' +  
      '<a class="btn" data-edit="italic" title="斜体 (Ctrl/Cmd+I)"><i class="icon-italic"></i></a>' +
      '<a class="btn" data-edit="strikethrough" title="中划线"><i class="icon-strikethrough"></i></a>' + 
      '<a class="btn" data-edit="underline" title="下划线 (Ctrl/Cmd+U)"><i class="icon-underline"></i></a>';
	divArr[2].append(tmpStr);
	
	//
	 
	tmpStr = '<a class="btn" data-edit="insertunorderedlist" title="Bullet list"><i class="icon-list-ul"></i></a>' +
	         '<a class="btn" data-edit="insertorderedlist" title="Number list"><i class="icon-list-ol"></i></a>'  +
	         '<a class="btn" data-edit="outdent" title="Reduce indent (Shift+Tab)"><i class="icon-indent-left"></i></a>' + 
	         '<a class="btn" data-edit="indent" title="Indent (Tab)"><i class="icon-indent-right"></i></a>';
	divArr[3].append(tmpStr);
	
	//
	tmpStr = '<a class="btn" data-edit="justifyleft" title="左对齐 (Ctrl/Cmd+L)"><i class="icon-align-left"></i></a>' +  
      		 '<a class="btn" data-edit="justifycenter" title="居中 (Ctrl/Cmd+E)"><i class="icon-align-center"></i></a>' + 
             '<a class="btn" data-edit="justifyright" title="右对齐 (Ctrl/Cmd+R)"><i class="icon-align-right"></i></a>' +  
      		 '<a class="btn" data-edit="justifyfull" title="两端对齐 (Ctrl/Cmd+J)"><i class="icon-align-justify"></i></a>';
	divArr[4].append(tmpStr);
	

    //
	tmpStr = '<div class="dropdown-menu input-append">' +  
        	 '<input class="span2" placeholder="URL" type="text" data-edit="超链接"/> ' +
        	 '<button class="btn" type="button">Add</button> ' + 
      		 '</div>';
	divArr[5].append(tmpStr);
	
	//
	if(parames.url){
		tmpStr = '<a class="btn" title="插入图片(or just drag & drop)" id="pictureBtn"><i class="icon-picture"></i></a>' +  
      		 '<input type="file" accept="images/*" id="descripitionImg" data-which="true" data-qroot="' + (parames.qroot ? parames.qroot : '') + '" data-url="'+ parames.url +'" data-role="magic-overlay" data-target="#pictureBtn" data-edit="insertImage"  multiple style="opacity: 0; position: absolute; top: -10px; left: 0px; width: 100%; height: 100%;cursor: pointer;" />' +
      		 '</div>';
	}else{
		tmpStr = '<a class="btn" title="Insert picture (or just drag & drop)" id="pictureBtn"><i class="icon-picture"></i></a>' +  
      		 '<input type="file" accept="images/*" id="descripitionImg" data-role="magic-overlay" data-target="#pictureBtn" data-edit="insertImage"  multiple style="opacity: 0; position: absolute; top: -10px; left: 0px; width: 100%; height: 100%;cursor: pointer;" />' + 
      		 '</div>';
	}
	divArr[6].append(tmpStr);
	
	
	tmpStr = '<a class="btn" data-edit="undo" title="撤销 (Ctrl/Cmd+Z)"><i class="icon-undo"></i></a>' +
      		 '<a class="btn" data-edit="redo" title="还原 (Ctrl/Cmd+Y)"><i class="icon-repeat"></i></a>';
	divArr[7].append(tmpStr);
	
	tmpStr = '<a class="btn" data-edit="leftFloat" title="左浮动"><i class="glyphicon glyphicon-arrow-left"></i></a>' + 
		'<a class="btn" data-edit="rightFloat" title="右浮动"><i class="glyphicon glyphicon-arrow-right"></i></a>'+
		'<a class="btn" data-edit="clearFloat" title="清除浮动"><i class="glyphicon glyphicon-remove-circle"></i></a>';
	divArr[8].append(tmpStr);
	
	
	var a9 = $("<a>").addClass("btn dropdown-toggle groundColorA").attr({"data-toggle": "dropdown", "title": "背景色"});
	var i9 = $("<i>").addClass("glyphicon glyphicon-grain");
	var b9 = $("<b>").addClass("caret");
	var u9 = $("<ul>").addClass("dropdown-menu");
	a9.append(i9).append(b9);
	divArr[9].append(a9).append(u9);
	
	tmpStr = '<a class="btn" data-edit="formatP" title="首行缩进"><i class="glyphicon glyphicon-indent-left"></i></a>' + 
		'<a class="btn" data-edit="formatPC" title="取消缩进"><i class="glyphicon glyphicon-indent-right"></i></a>';
	divArr[10].append(tmpStr);
	
	if(parames.dom){
		var box = parames.dom;
	}else{
		var box = $(".btn-toolbar");
	}
	for(var i = 0; i < divArr.length; i ++){
		box.append(divArr[i]);
	} 
	initToolbarBootstrapBindings();
	var ret;
	if(parames.bindDom){
		ret = parames.bindDom.wysiwyg({ fileUploadError: showErrorAlert} );
	}else{
		ret = $('#editor').wysiwyg({ fileUploadError: showErrorAlert} );
	}
	
	window.prettyPrint && prettyPrint();
	return ret.arr;
}

function initToolbarBootstrapBindings() {
    var fontTarget = $('[title=字体]').siblings('.dropdown-menu');
    var fontsExtend = [
               {name : "宋体", value : "SimSun"}, 
               {name : "微软雅黑", value : "Microsoft Yahei"},
               {name : "楷体", value : "KaiTi"},
               {name : "幼圆", value : "YouYuan"},
               {name : "Times New Roman", value : "Times New Roman"},
               {name : "Serif", value : "Serif"},
               {name : "Arial", value : "Arial"},
               {name : "Courier", value : "Courier"},
               {name : "Comic Sans MS", value : "Comic Sans MS"},
               {name : "Lucida Sans", value : "Lucida Sans"}
    ];
    $.each(fontsExtend, function(ids, fontEle){
    	fontTarget.append($('<li><a data-edit="fontName ' + fontEle.value +'" style="font-family:\''+ fontEle.value +'\'">'+ fontEle.name + '</a></li>'));
    });
    $('a[title]').tooltip({container:'body'});
  	$('.dropdown-menu input').click(function() {return false;})
		    .change(function () {$(this).parent('.dropdown-menu').siblings('.dropdown-toggle').dropdown('toggle');})
      .keydown('esc', function () {this.value='';$(this).change();});

    $('[data-role=magic-overlay]').each(function () { 
      var overlay = $(this), target = $(overlay.data('target')); 
      overlay.css('opacity', 0).css('position', 'absolute').offset(target.offset()).width(target.outerWidth()).height(target.outerHeight());
    });
    if ("onwebkitspeechchange" in document.createElement("input")) {
      var editorOffset = $('#editor').offset();
      $('#voiceBtn').css('position','absolute').offset({top: editorOffset.top, left: editorOffset.left+$('#editor').innerWidth()-35});
    } else {
      $('#voiceBtn').hide();
    }
    
    $('[data-edit=leftFloat]').click(function(){
    	var imgEle = $("#editor").find("img[_moz_resizing='true']");
    	if(imgEle.length == 1){
    		imgEle.css({
    			float: 'left',
    			margin: '10px'
    		});
    	}
    });
    
    $('[data-edit=rightFloat]').click(function(){
    	var imgEle = $("#editor").find("img[_moz_resizing='true']");
    	if(imgEle.length == 1){
    		imgEle.css({
    			float: 'right',
    			margin: '10px'
    		});
    	}
    });
    
    $('[data-edit=clearFloat]').click(function(){
    	var imgEle = $("#editor").find("img[_moz_resizing='true']");
    	if(imgEle.length == 1){
    		imgEle.css({
    			float: 'none',
    			margin: '0px'
    		});
    	}
    });
    
    $('[data-edit=formatP]').click(function(){
		if($(window.getSelection().focusNode.parentElement).prop('class') == "editorBox"){
			if(window.getSelection().focusNode.nodeName == '#text'){
				$(window.getSelection().focusNode).wrapAll("<p style=\"text-indent: 21pt\"></p>");
			}else{
				$(window.getSelection().focusNode).css({
					textIndent: '21pt'
				});
			}
		}else{
			if(window.getSelection().focusNode.nodeName == '#text'){
				$(window.getSelection().focusNode.parentElement).css({
					textIndent: '21pt'
				});
			}else{
				$(window.getSelection().focusNode).css({
					textIndent: '21pt'
				});
			}
		}
    });
    
    $('[data-edit=formatPC]').click(function(){
		if($(window.getSelection().focusNode.parentElement).prop('class') == "editorBox"){
			if(window.getSelection().focusNode.nodeName == '#text'){
				$(window.getSelection().focusNode).wrapAll("<p style=\"text-indent: 0pt\"></p>");
			}else{
				$(window.getSelection().focusNode).css({
					textIndent:'0pt'
				});
			}
		}else{
			if(window.getSelection().focusNode.nodeName == '#text'){
				$(window.getSelection().focusNode.parentElement).css({
					textIndent:'0pt'
				});
			}else{
				$(window.getSelection().focusNode).css({
					textIndent:'0pt'
				});
			}
		}
    });
    
    var colorTarget = $('.groundColorA').siblings('.dropdown-menu');
    var colorExtend = [
                       {name : "无", value : "transparent"}, 
                       {name : "白色", value : "white"},
                       {name : "红色", value : "red"},
                       {name : "绿色", value : "green"},
                       {name : "蓝色", value : "blue"},
                       {name : "黑色", value : "black"}
            ];
    $.each(colorExtend, function(ids, colorE){
    	var temp = $('<li><a data-edit="' + colorE.value +'" style="background:'+ colorE.value +';">'+ colorE.name + '</a></li>');
    	colorTarget.append(temp);
    });
    
    colorTarget.find('li').click(function(){
    	// 如果被选中
    	if(!window.getSelection().isCollapsed){
    		var sel = window.getSelection();
    		if(sel.toString() == sel.focusNode.textContent){
    			// 如果是全选
    			if($(window.getSelection().focusNode.parentElement).prop('class') == "editorBox"){
    				if(window.getSelection().focusNode.nodeName == '#text'){
    					$(window.getSelection().focusNode).wrapAll("<span style='background:" + $(this).children('a').data().edit + "'></span>");
    				}else{
    					$(window.getSelection().focusNode).css({
    						background: $(this).children('a').data().edit
    					});
    				}
    			}else{
    				if(window.getSelection().focusNode.nodeName == '#text'){
    					$(window.getSelection().focusNode.parentElement).css({
    						background: $(this).children('a').data().edit
    					});
    				}else{
    					$(window.getSelection().focusNode).css({
    						background: $(this).children('a').data().edit
    					});
    				}
    			}
    		}else{
    			$(sel.anchorNode).wrapAll("<span style='background:" + $(this).children('a').data().edit + "'></span>");
    		}
    	}
    });
    
};
function showErrorAlert (reason, detail) {
	var msg='';
	if (reason==='unsupported-file-type') { msg = "Unsupported format " +detail; }
	else {
		console.log("error uploading file", reason, detail);
	}
	$('<div class="alert"> <button type="button" class="close" data-dismiss="alert">&times;</button>'+ 
	 '<strong>File upload error</strong> '+msg+' </div>').prependTo('#alerts');
};